<template>
  <div>
    <el-row>
      <el-col :span="18">
        <el-descriptions title="产品成果信息"></el-descriptions>
        <el-form ref="form" :model="form" :disabled="true" label-position="top"  label-width="80px">
          <el-row :gutter="15">
            <el-col :span="12">
              <el-form-item label="产品名称" prop="pName">
                <el-input v-model="form.pName" placeholder="请输入产品名称"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="产品类型" prop="pType">
                <el-cascader
                  :options="productFormTree"
                  :props="{value:'code',label:'name' }"
                  clearable
                  regionTree
                  placeholder="请输入产品类型"
                  v-model="form.pType"
                ></el-cascader>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="行业" prop="pIndustry">
                <el-select v-model="form.pIndustry" placeholder="请选择行业">
                  <el-option
                    v-for="dict in dict.type.product_industry"
                    :key="dict.value"
                    :label="dict.label"
                    :value="dict.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="版本型号" prop="pVersion">
                <el-input v-model="form.pVersion" placeholder="请输入版本型号"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="产品介绍" prop="pIntroduce">
                <el-input v-model="form.pIntroduce" placeholder="请输入产品介绍"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="厂商" prop="pManufacturer">
                <el-input v-model="form.pManufacturer" placeholder="请输入厂商"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">


              <el-form-item label="联系人" prop="pContacts">
                <el-input v-model="form.pContacts" placeholder="请输入联系人"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="联系方式" prop="pTel">
                <el-input v-model="form.pTel" placeholder="请输入联系方式"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">

              <el-form-item label="关键词" prop="pKeyword">
                <el-input v-model="form.pKeyword" placeholder="请输入关键词"/>
              </el-form-item>

            </el-col>
            <el-col :span="12">
              <el-form-item label="数据来源" prop="pDataSource">
                <el-input v-model="form.pDataSource" placeholder="请输入数据来源"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="备注" prop="remark">
                <el-input v-model="form.remark" placeholder="请输入备注"/>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <el-descriptions title="适配信息"></el-descriptions>
        <el-table :data="adaptations" >
          <el-table-column label="适配OS" align="center" prop="paOs">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.audition_os" :value="scope.row.paOs"/>
            </template>
          </el-table-column>
          <el-table-column label="适配平台" align="center" prop="paPlatform">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.adaptation_platform" :value="scope.row.paPlatform"/>
            </template>
          </el-table-column>
          <el-table-column label="适配OS版本" align="center" prop="paVersion"/>
          <el-table-column label="OS小版本" align="center" prop="paMinVersion"/>
          <el-table-column label="适配CPU型号" align="center" prop="paCpu">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.adapted_cpu_model" :value="scope.row.paCpu"/>
            </template>
          </el-table-column>
          <el-table-column label="认证状态" align="center" prop="paAuthenticationStatus">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.certification_status" :value="scope.row.paAuthenticationStatus"/>
            </template>
          </el-table-column>
          <el-table-column label="上架情况" align="center" prop="paListing">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.auditing_listing" :value="scope.row.paListing"/>
            </template>
          </el-table-column>
          <el-table-column label="适配状态" align="center" prop="paState">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.auditing_status" :value="scope.row.paState"/>
            </template>
          </el-table-column>
          <el-table-column label="适配时间" align="center" prop="paTime" width="180">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.paTime, '{y}-{m}-{d}') }}</span>
            </template>
          </el-table-column>
          <el-table-column label="收费/免费" align="center" prop="auditing_cost">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.auditing_cost" :value="scope.row.auditing_cost"/>
            </template>
          </el-table-column>
          <el-table-column label="备注" align="center" prop="paRemark"/>
        </el-table>
      </el-col>
      <el-col :span="6">
        <el-descriptions title="审核记录"></el-descriptions>
        <div class="block">
          <el-timeline>
            <el-timeline-item
              v-for="item in auditingList"
              :key="item.id"
              :timestamp="item.createTime"
              :type="item.aState === '1'?'danger':'success'"

              placement="top">
              <el-card>
                <div slot="header" class="clearfix">
                  {{ item.createBy }}
                </div>
                <p> {{item.aInfo}}</p>
              </el-card>
            </el-timeline-item>
          </el-timeline>
        </div>
      </el-col>
    </el-row>
    <div class="mb8"></div>
    <div  class="dialog-footer">
      <el-button @click="cancel">取 消</el-button>
    </div>
  </div>
</template>

<script>
import EditMixin from "@/minixs/edit"
import request from "@/utils/request";
import {listProductType} from "@/api/info/productType";

export default {
  name: "detail",
  mixins: [EditMixin],
  dicts: ['product_industry', 'audition_os', 'adapted_cpu_model', 'compatibility_level', 'adaptation_verification_status', 'adaptation_platform', 'auditing_status', 'auditiing_os_type', 'auditing_listing', 'certification_status','auditing_cost'],
  data() {
    return {
      // 表单数据
      form: {
        id: null,
        climecode: null,
        climename: null,
        pcode: null,
        delFlag: null,
        createBy: null,
        updateBy: null,
        createTime: null,
        updateTime: null,
        remark: null
      },
      // 适配信息
      adaptations: [],
      // 审核列表
      auditingList:[],
      productFormTree:[]
    }
  },
  created() {
    listProductType(this.queryParams).then(response => {
      this.productFormTree = this.handleTree(response.data, "code", "pcode");
    });
    request({
      url: '/info/adaptation/list',
      method: 'get',
      params: {
        pageNum: 1,
        pageSize: 100,
        pid: this.id
      }
    }).then(response => {
      this.adaptations = response.rows;

    });

    request({
      url: '/info/auditing/list',
      method: 'get',
      params: {
        pageNum: 1,
        pageSize: 100,
        aPId:this.id,
        pName:"product"
      }
    }).then(response => {
      this.auditingList = response.rows;
    });
  },
  mounted() {

    request({
      url: '/info/product/' + this.id,
      method: 'get'
    }).then(res => {
      const form = res.data;
      form.pType = form.pType.split(",");
      this.form = form;
    })
  },
};
</script>
